<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt"  prefix="fmt"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'reclassify.jsp' starting page</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	  <style type="text/css">
		  a{
			  text-decoration: none;
			  color: darkgoldenrod;
			  font-size: 20px;
		  }
		  .bigBox{
			  position: fixed;
			  font-size: 26px;
		  }
		  *{padding: 0; margin: 0;}
		  ul li{
			  list-style: none;
		  }
		  .bigBox table{
			  width: 70vw;
			  font-size: 20px;
			  text-align: center;
			  background-color: white;
			  margin: 20px 20px;
			  border: 1px solid white;
		  }
		  .bigBox table tr{
			  height: 50px;
		  }
		  .bigBox input{
			  font-size: 20px;
		  }
		  button{
			  font-size: 20px;
			  padding: 8px 20px;
			  border-radius: 10px;
			  border: 2px solid #95d7e4;
			  background-color: #6c84a7;
		  }
		  .bigBox table tr:nth-child(even){
			  background-color: #d6d6d6;
		  }
		  .add{
			  border-radius: 20px;
			  color: white;
			  width: 440px; height: 260px;
			  background-color: #374866;
			  border: 1px solid #6c84a7;
			  text-align: center;
			  position: absolute;
			  top: 160px; left: 260px;
			  display: none;
		  }
		  .add li{
			  line-height: 80px;
		  }
		  .add input{
			  width: 280px; height: 50px;
			  padding-left: 10px;
			  border-radius: 10px;
		  }
	  </style>
	  <script src="/static/js/jquery-3.4.1.min.js"></script>
	  <script type="text/javascript">
		  $(function(){
			  $(".btnblock").click(function(){
				  $(".add").css("display","block");
			  });
			  $(".btnnone").click(function(){
				  $(".add").css("display","none");
			  });
			  $(".delete").click(function(){
				  var check = confirm("确认删除吗？");
				  var fid = $(".fid").val();
				  if(check == true){
					  $(".firstform").attr("action","${pageContext.request.contextPath }/type/delreclassify");
				  }else{
					  $(".firstform").attr("action","${pageContext.request.contextPath }/type/typeEdit/"+fid);
				  }
			  });
		  });

	  </script>
  </head>
  
  <body>
  <div class="bigBox">
	  <a href="type/list">&lt;返回一级分类</a>
	  <br/><br/>
	  <p>二级分类列表</p>
	  <!-- ${pageContext.request.contextPath }/type/list -->
	  <form class="firstform" action="" method="post">

		  <table>
			  <tr>
				  <td>全选框</td>
				  <td>二级分类名称</td>
			  </tr>
			  <c:forEach items="${reclassifylist }" var="reclassifylist" varStatus="status">
				  <tr>
					  <td>
						  <input type="checkbox" name="ids" value="${reclassifylist.id }" style="zoom:200%;"/>
						  <input type="hidden" name="reclassifylist[${status.index }].id" value="${reclassifylist.id }" />
						  <input class="fid" type="hidden" name="reclassifylist[${status.index }].fid" value="${reclassifylist.fid }" />
					  </td>
					  <td>
						  <input type="text" name="reclassifylist[${status.index }].typeName" value="${reclassifylist.typeName }" />
					  </td>
				  </tr>
			  </c:forEach>
			  <tr>
				  <td><button class="btnblock" type="button">添加二级分类</button></td>
				  <td><button class="delete">批量删除</button></td>
			  </tr>
		  </table>
	  </form>
	  <div class="add">
		  <form action="${pageContext.request.contextPath }/type/addreclassify" method="post">
			  <ul>
				  <li>二级分类添加</li>
				  <li><input type="text" name="typeName" /><br /></li>
				  <li><button class="btnnone" type="submit">提交</button>&nbsp;<button class="btnnone" type="button">取消</button></li>
			  </ul>
		  </form>
	  </div>
  </div>
  </body>
</html>
